<template>
  <view class='map'>
    <!-- 地图组件 scale缩放：数值越大，越放大-->
  <map name="" :longitude="longitude" :latitude="latitude" :scale="scale"></map>
    <button @tap="openPostion">打开定位</button>
    <button @tap="selectPostion">选择定位</button>
    <!-- 嵌入h5页面 -->
    <!-- <web-view src="http://baidu.com"></web-view> -->
  </view>
</template>

<script>
export default {
  name: 'MyComponent',
  props: { },
  data () {
    return {
      // 经度
      longitude: 116.39742,
      // 纬度
      latitude: 39.909,
      // 缩放:数值越大，越放大
      scale: 16
    };
  },
  onLoad () {
    this.getPostion();
  },
  computed: { },
  created () { },
  mounted () { },
  methods: {
    getPostion () {
      // 获取定位
      uni.getLocation({
        type: 'wgs84',
        success: res => {
          console.log('当前位置的经度：' + res.longitude);
          console.log('当前位置的纬度：' + res.latitude);
          this.longitude = res.longitude;
          this.latitude = res.latitude;
        }
      });
    },
    openPostion () {
      // 查看位置
      uni.openLocation({
        longitude:this.longitude ,
        latitude:this.latitude
      });
    },
    selectPostion () {
      // 选择位置
      uni.chooseLocation({
        success: function (res) {
          console.log('位置名称：' + res.name);
          console.log('详细地址：' + res.address);
          console.log('纬度：' + res.latitude);
          console.log('经度：' + res.longitude);
        }
      });
    }
  }
};
</script>

<style scoped lang='scss'>
map {
  width: 750rpx;
  height: 400rpx;
}
</style>
